<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>添加员工</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/frame/layui/css/layui.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/frame/static/css/style.css">
</head>
<body>
<!-- 添加员工 -->
<div id="add_emp_div">
    <div style="width: 600px;height: 570px;padding: 15px">
        <div style="width: 400px;height:500px;float: left">
            <form id="add_emp_form" class="layui-form" 
                  method="post" lay-filter="add_emp_form">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">真实姓名:</label>
                        <div class="layui-input-inline">
                            <input type="text" name="ename" lay-verify="required" placeholder="请输入..."
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">登录名称:</label>
                        <div class="layui-input-inline">
                            <input type="text" name="loginname" lay-verify="pass" placeholder="请输入..."
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">登录密码:</label>
                        <div class="layui-input-inline">
                            <input type="password" name="pwd" lay-verify="required" placeholder="请输入..."
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">所在部门:</label>
                    <div class="layui-input-inline">
                        <select id="findDept" name="dept.did" lay-filter="dept_id_select">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">性别:</label>
                    <div class="layui-input-block">
                        <input type="radio" name="sex" value="男" title="男" checked="">
                        <input type="radio" name="sex" value="女" title="女">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">员工头像:</label>
                    <div class="layui-input-block">
                    	<input  class="layui-input" readonly="readonly" name="eimg" 
                    	value="image/face2.jpg" id="emp_input_img" style="width: 200px" > 
                        <button style="margin-left: 200px; margin-top: -38px" 
                        class="layui-btn" id="upload_btn" >浏览</button>
                    </div>
                </div>
                <div class="layui-form-item ">
                    <label class="layui-form-label">员工备注:</label>
                    <div class="layui-input-block">
                        <textarea name="eremark" value="" required placeholder="请输入内容" class="layui-textarea"></textarea>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">员工级别:</label>
                    <div class="layui-input-inline">
                        <select name="eflag" lay-filter="aihao">
                            <option value="0" selected="">普工</option>
                            <option value="1">部门主管</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">权限级别:</label>
                    <div class="layui-input-inline">
                        <select name="eadmin" lay-filter="jibie">
                            <option value="0" selected="">普通操作者</option>
                            <option value="1">部门主管</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit="">新增员工</button>
                    </div>
                </div>
            </form>
        </div>

        <!--右边上传图片预览-->
        <div style="width:auto; float: left">
            <img src="${pageContext.request.contextPath}/image/face2.jpg" style="width: 150px;height: 150px"
                 class="layui-upload-img layui-circle" id="upload_img"/>
            <p id="upload_imgText"></p>
        </div>
    </div>
</div>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/frame/layui/layui.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/index.js"></script>
<script type="text/javascript">
	layui.use(['element', 'table', 'jquery', 'layer', 'form', 'upload'], function () {
	    var $ = layui.jquery,
	        layer = layui.layer,
	        form = layui.form,
	        upload = layui.upload;
	  	//清空
		$("#findDept").empty();
		//发送请求数据 获取数据 添加到部门的select 标签里面
		var url = "${pageContext.request.contextPath }/deptAction_findNoAllDept.action";
		//查询没有被关联的客户
		$.post(url,{},function(data,status){
			//循环数组
			for(var i = 0 ;i<data.length;i++){
				//获取id name
				var id = data[i].did;
				var name = data[i].dname;
				//
				$("#findDept").append("<option value = "+id+">"+name+"</option>");
				form.render();
			}
		});
		//上传头像
		layui.use('upload', function(){
			  var upload = layui.upload;
			  //执行实例
			  var uploadInst = upload.render({
			    elem: '#upload_btn' //绑定元素
			    ,url: '/upload/' //上传接口
			    	,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
			    	    layer.load(); //上传loading
			    	  }
			    	  ,done: function(res, index, upload){
			    	    layer.closeAll('loading'); //关闭loading
			    	  }
			    	  ,error: function(index, upload){
			    	    layer.closeAll('loading'); //关闭loading
			    	  }
			  });
			});
		var index = parent.layer.getFrameIndex(window.name); //获取窗口索引

        //监听提交
        form.on('submit(add_emp_form)', function (data) {
            submit_form();
            return false;
        });

        //提交表单
        function submit_form() {
            $.post("${pageContext.request.contextPath}/empAction_add.action",
                $("#add_emp_form").serialize(),
                function (data) {
                    parent.location.href = '${pageContext.request.contextPath}/page_emp_emp.action';
                    parent.layer.close(index);
                });
        }

	})
</script>
</body>
</html>